<template>
  <base-breadcrumb>
    <searchData :searchData="searchArr" @search="search"></searchData>
    <a-card :bordered="false">
      <!-- <title-name :title="$route.meta.title"></title-name> -->
      <a-row :gutter="10">
        <a-col :span="24">
            <!-- :scroll="{ x: 1300 }" -->
          <list-table
            ref="table"
            :columns="columns"
            :request="loadData"
          >
            <template
              slot="prefix"
              slot-scope="ref"
            >
              <a-button
                v-btnPermission="'stm_011_add_01'"
                :loading="addLoading"
                type="primary"
                @click="handleManage('add')"
              >
                新增科技活动
              </a-button>
            </template>
            <span
              slot="index"
              slot-scope="text, record, index"
            >{{ index + 1 }}</span>
            
            <!-- 表格行操作栏 -->
            <span slot="action" slot-scope="text, record">
              <MoreButton>
                <a v-btnPermission="'stm_011_loo_03'" @click="handleManage('look', record.id)">查看</a>
                <a-divider v-btnPermission="'stm_011_edi_02'" type="vertical" />
                <a v-btnPermission="'stm_011_edi_02'" @click="handleManage('edit', record.id)">编辑</a>
                <a-divider v-btnPermission="'stm_011_del_04'" type="vertical" />
                <a
                  v-btnPermission="'stm_011_del_04'"
                  @click="remove(record.id)"
                  >删除</a
                >
              </MoreButton>
            </span>
          </list-table>
        </a-col>
      </a-row>
    </a-card>
  </base-breadcrumb>
  
</template>

<script>
import { STable } from '@/components' // 表格
import SelectFormat from './components/SelectFormat.vue' // 业态
import { activityList, activityDel } from '@/api/science'
const searchArr = [
  // 搜索框
  {
    name: '活动名称',
    value: 'name',
    type: 'input',
  },
  {
    name: '活动类型',
    valueKey: 'activityTypeId',
    type: SelectFormat,
  },
  {
    name: '参与人',
    value: 'worker',
    type: 'input',
  },
  {
    name: '活动时间',
    value: 'activityTime',
    type: 'dateRange',
  },
  {
    name: '主办单位',
    value: 'mainUnit',
    type: 'input',
  }
]
const columns = [
  {
      title: '序号',
      width: '80px',
      scopedSlots: {customRender: 'index'},
  },
  {
    title: '活动名称',
    ellipsis: true,
    dataIndex: 'name',
  },
  {
    title: '主办单位',
    ellipsis: true,
    width: '150px',
    dataIndex: 'mainUnit',
  },
  {
    title: '组织单位',
    ellipsis: true,
    width: '300px',
    dataIndex: 'orgName',
  },
  {
    title: '活动类型',
    ellipsis: true,
    dataIndex: 'activityTypeName',
    width: '150px',
  },
  {
    title: '参与人',
    ellipsis: true,
    width: '170px',
    dataIndex: 'workers',
  },
  {
    title: '参加人数',
    ellipsis: true,
    width: '170px',
    dataIndex: 'empNumber',
  },
  {
    title: '活动时间',
    ellipsis: true,
    width: '170px',
    dataIndex: 'activityTime',
  },
  {
    title: '操作',
    dataIndex: 'actions',
    width: '170px',
    fixed: 'right',
    scopedSlots: { customRender: 'action' },
  },
]
export default {
  name:'a'+ Date.now(),
  components: {
    SelectFormat
  },
  computed: {
  },
  data() {
    this.columns = columns
    this.searchArr = searchArr
    return {
      addLoading: false,
      // 查询参数
      queryParam: {},
      // 加载数据方法 必须为 Promise 对象
      loadData: (parameter) => {
        let that = this
        const requestParameters = Object.assign({}, parameter, that.queryParam)
        return activityList(requestParameters).then((res) => {
          return res
        })
      },
    }
  },
  mounted() {
    let that = this
  },
  methods: {
    remove(id) {
      let that = this
      that.$confirm({
        title: '提示',
        content: '确定是否删除？',
        okText: '确定',
        cancelText: '取消',
        onOk() {
          return activityDel(id).then((res) => {
            if (res.code == 200 || res.data.code == 200) {
              that.$message.success('删除成功！')
              that.$refs.table.getData(null, true)
            }
          })
        },
      })
    },
    search(value) {
      // 赋值表单
      if (value) {
        this.queryParam = value
        if (this.queryParam.activityTime?.length > 0) {
          this.queryParam.beginTime = this.$dateFormat(this.queryParam.activityTime[0], 'D')
          this.queryParam.endTime = this.$dateFormat(this.queryParam.activityTime[1], 'D')
          delete this.queryParam.activityTime
        }
      }
      this.$refs.table.getData(null, true)
    },
    // 新增、编辑、查看
    handleManage(type, id) {
      this.$router.push({
        path: '/science/activity/edit',
        query: {
          type,
          id
        },
      })
    },
  },
}
</script>

